<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>Index</title>
    <style>
        table, tr, td {
            border: 1px solid black;
        }

        td {
            padding: 10px;
        }

        a {
            display: inline-block;
            margin-bottom: 10px;
        }
        .update, .delete{
            cursor: pointer;
        }
    </style>
</head>
<body>
<div class="logout"><a href="/logout">退出</a></div>
<h1>This is Index Page ~!</h1>
<form action="/resume/insert" method="post" class="resumeForm">
    <input name="id" type="hidden" class="inputID">
    <input name="name" type="text" placeholder="请输入姓名" class="inputName">
    <input name="address" type="text" placeholder="请输入地址" class="inputAddress">
    <input name="phone" type="text" placeholder="请输入联系电话" class="inputPhone">
    <input type="submit" value="添加" class="commit">
</form>
<c:if test="${resumes.size() > 0}">
    <table>
        <thead>
            <tr>
                <td>id</td>
                <td>name</td>
                <td>address</td>
                <td>phone</td>
                <td>update</td>
                <td>delete</td>
            </tr>
        </thead>
        <tbody>
            <c:forEach items="${resumes}" var="item">
                <tr>
                    <td>${item.id}</td>
                    <td>${item.name}</td>
                    <td>${item.address}</td>
                    <td>${item.phone}</td>
                    <td class="update">编辑</td>
                    <td class="delete"><a href="/resume/delete?id=${item.id}">删除</a></td>
                </tr>
            </c:forEach>
        </tbody>
    </table>
</c:if>
<script src="/js/jquery-2.2.4.min.js"></script>
<script>
    $(".update").click(function () {
        let tds = $(this).parent().find("td");
        $(".inputID").val(tds[0].innerText);
        $(".inputName").val(tds[1].innerText);
        $(".inputAddress").val(tds[2].innerText);
        $(".inputPhone").val(tds[3].innerText);
        $(".commit").val("修改");
        $(".resumeForm").attr("action", "/resume/update");
    });
</script>
</body>
</html>
